<template>

    <h3>9.计算属性</h3>
    <p>{{ num >= 5 ? true : false }}</p>

    <!-- 对于模板中较长的表达式，可以使用计算属性来让代码更整洁 -->
    <p>{{ content }}</p>

    <!-- 注意到使用函数也可以同样实现该操作 -->
    <p>{{ contents() }}</p>

    <!-- 两者的区别是，计算属性里存的是一个值，只有该值发生变化时，
     才会重新计算，也就是说在多次调用时，相当于仅仅传递一个定值
     
     而函数里存的是方法，在每次调用时都会重新执行代码，相对更加复杂-->

</template>

<script>

    export default {
        data(){
            return{
                num:10
            }
        },
        //计算属性
        computed:{
            content(){
                return this.num >= 5 ? true : false
            }
        },
        methods:{
            contents(){
                return this.num >= 5 ? true : false
            }
        }
    }

</script>